import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:wanandroid_flutter/controller/login_controller.dart';

class LoginPage extends StatelessWidget {
  LoginPage({super.key});

  final LoginController loginCtr = Get.put(LoginController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body:
            Column(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [
      Container(
          alignment: Alignment.center,
          child: const Text(
            "账号登录",
            textAlign: TextAlign.center,
            style: TextStyle(
                fontSize: 24, fontWeight: FontWeight.w400, color: Colors.black),
          )),
      Column(
        children: [
          buildEditText(context, "请输入登录账号", loginCtr.userCtr),
          const Padding(padding: EdgeInsets.only(top: 50)),
          buildEditText(context, "请输入登录密码", loginCtr.passwordCtr, isPwd: true)
        ],
      ),
      Container(
          width: double.infinity,
          margin: const EdgeInsets.symmetric(horizontal: 50),
          child: RawMaterialButton(
              shape: const RoundedRectangleBorder(
                  borderRadius: BorderRadius.all(Radius.circular(20))),
              onPressed: () {
                loginCtr.httpLogin();
              },
              fillColor: Theme.of(context).colorScheme.primary,
              child: const Text("登录", style: TextStyle(color: Colors.white))))
    ]));
  }

  /// 输入框组件
  Widget buildEditText(BuildContext context, String hintText,
      TextEditingController textEditingController,
      {bool isPwd = false}) {
    var isShowPwd = false.obs;
    return Container(
        height: 40,
        padding: const EdgeInsets.symmetric(horizontal: 50),
        child: Obx(() => TextField(
            obscureText: isPwd & !isShowPwd.value,
            controller:textEditingController,
            keyboardType:
                isPwd ? TextInputType.visiblePassword : TextInputType.number,
            decoration: InputDecoration(
                contentPadding: const EdgeInsets.symmetric(horizontal: 15),
                suffixIcon: isPwd
                    ? IconButton(
                        icon: Icon(isShowPwd.value
                            ? Icons.visibility
                            : Icons.visibility_off),
                        onPressed: () {
                          isShowPwd.value = !isShowPwd.value;
                        })
                    : const SizedBox.shrink(),
                hintText: hintText,
                fillColor: Colors.grey.shade300,
                filled: true,
                focusedBorder: OutlineInputBorder(
                  borderSide:
                      BorderSide(color: Theme.of(context).colorScheme.primary),
                  borderRadius: const BorderRadius.all(Radius.circular(60)),
                ),
                enabledBorder: const OutlineInputBorder(
                  borderSide: BorderSide(color: Colors.white10),
                  borderRadius: BorderRadius.all(Radius.circular(60)),
                )))));
  }
}
